import MarkdownIt from 'markdown-it';
import { align } from "@mdit/plugin-align";
import VMdPreview from '@kangc/v-md-editor/lib/preview';
import '@kangc/v-md-editor/lib/style/preview.css';
// import githubTheme from '@kangc/v-md-editor/lib/theme/github.js';
// import '@kangc/v-md-editor/lib/theme/style/github.css';
import vuePressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';

import createEmojiPlugin from '@kangc/v-md-editor/lib/plugins/emoji/index';
import '@kangc/v-md-editor/lib/plugins/emoji/emoji.css';

import createAlignPlugin from '@kangc/v-md-editor/lib/plugins/align'; // 内容定位

import '@kangc/v-md-editor/lib/theme/style/vuepress.css';
import createLineNumbertPlugin from '@kangc/v-md-editor/lib/plugins/line-number/index'; // 代码行号
import Prism from 'prismjs';
// highlightjs
import hljs from 'highlight.js';

import VueMarkdownEditor from '@kangc/v-md-editor';
import createHighlightLinesPlugin from '@kangc/v-md-editor/lib/plugins/highlight-lines/index';


VMdPreview.use(vuePressTheme, {
  Hljs: hljs,
  Prism,
  config:{
    toc:{
        includeLevel:[1,2,3,4]
    }
  },
  extend(md) {
    // md为 markdown-it 实例，可以在此处进行修改配置,并使用 plugin 进行语法扩展
    md.use(align)
  }
});


VMdPreview.use(createLineNumbertPlugin());
VMdPreview.use(createEmojiPlugin()); // 引入表情
VMdPreview.use(createAlignPlugin());
VMdPreview.use(createHighlightLinesPlugin());

export default defineNuxtPlugin((nuxtApp) => {
    nuxtApp.vueApp.use(VMdPreview)
})